<template>
  <div class="page-container">
    <table-index :table="table" @loadData="loadData">
      <template #log="{ record }">
        <p v-for="item in record.contentList" :key="item">{{ item }}</p>
      </template>
    </table-index>
  </div>
</template>
<script setup name="CarInfoOperateRecords">
  import { reactive, onMounted } from 'vue'
  import { useTable, useFetchTableDataApi } from '@/hooks/table'
  import { getOperateLog } from '@/api/common'
  import { useRoute } from 'vue-router'
  const route = useRoute()
  const params = route.params

  const queryParam = reactive({
    bizId: params.id,
    bizType: 32,
  })

  const table = useTable({
    columns: [
      {
        title: '操作人',
        dataIndex: 'userName',
        width: 200,
      },
      {
        title: '操作时间',
        dataIndex: 'operateTime',
        width: 200,
      },
      { title: '操作', dataIndex: 'node', width: 200 },
      { title: '车辆同步状态', dataIndex: 'businessStatusName', width: 150 },
      { title: '备注', slotName: 'log' },
    ],
    tableLoading: false,
  })

  const loadData = useFetchTableDataApi(table, queryParam, getOperateLog)

  onMounted(() => {
    loadData()
  })
</script>
<style scoped lang="less"></style>
